﻿@page "/tests/validations"
<Row>
    <Column ColumnSize="ColumnSize.IsHalf">
        <Card Margin="Margin.Is4.OnY">
            <CardHeader>
                <CardTitle>Auto Validation</CardTitle>
                <CardSubtitle>Example on how to validate input fields.</CardSubtitle>
            </CardHeader>
            <CardBody>
                <Field IsHorizontal="true">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Full Name</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidationRule.IsNotEmpty">
                            <TextEdit Placeholder="First and last name">
                                <Feedback>
                                    <ValidationError>Enter full name!</ValidationError>
                                </Feedback>
                            </TextEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Email address</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidationRule.IsEmail">
                            <TextEdit Placeholder="Enter email">
                                <Feedback>
                                    <ValidationSuccess>Email is good</ValidationSuccess>
                                    <ValidationError>Enter valid email!</ValidationError>
                                </Feedback>
                            </TextEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Password</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidatePassword">
                            <TextEdit Role="TextRole.Password" Placeholder="Password" @bind-Text="@password">
                                <Feedback>
                                    <ValidationError>Password must be at least 6 characters long!</ValidationError>
                                </Feedback>
                            </TextEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Re Password</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidatePassword2">
                            <TextEdit Role="TextRole.Password" Placeholder="Retype password">
                                <Feedback>
                                    <ValidationError>Password does not match!</ValidationError>
                                </Feedback>
                            </TextEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Input Select</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidateSelect">
                            <SelectEdit TValue="int?">
                                <ChildContent>
                                    <SelectItem Value="@((int?)null)"></SelectItem>
                                    <SelectItem Value="@((int?)1)">1</SelectItem>
                                    <SelectItem Value="@((int?)2)">2</SelectItem>
                                    <SelectItem Value="@((int?)3)">3</SelectItem>
                                    <SelectItem Value="@((int?)4)">4</SelectItem>
                                </ChildContent>
                                <Feedback>
                                    <ValidationError>Select one value!</ValidationError>
                                </Feedback>
                            </SelectEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Date</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidateDateOfBirth">
                            <DateEdit>
                                <Feedback>
                                    <ValidationError>You must enter date of birth!</ValidationError>
                                </Feedback>
                            </DateEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                    <FieldLabel ColumnSize="ColumnSize.Is2">Pattern</FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation UsePattern="true">
                            <TextEdit Pattern="[A-Za-z]{3}">
                                <Feedback>
                                    <ValidationError>Pattern [A-Za-z]{3} does not match!</ValidationError>
                                </Feedback>
                            </TextEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                    <FieldLabel ColumnSize="ColumnSize.Is2"></FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <Validation Validator="@ValidateCheck">
                            <CheckEdit>
                                <ChildContent>
                                    Check me out
                                </ChildContent>
                                <Feedback>
                                    <ValidationError>You must check me out!</ValidationError>
                                </Feedback>
                            </CheckEdit>
                        </Validation>
                    </FieldBody>
                </Field>
                <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                    <FieldLabel ColumnSize="ColumnSize.Is2"></FieldLabel>
                    <FieldBody ColumnSize="ColumnSize.Is10">
                        <SimpleButton Color="Color.Primary">Submit</SimpleButton>
                    </FieldBody>
                </Field>
            </CardBody>
        </Card>
    </Column>
    <Column ColumnSize="ColumnSize.IsHalf">
        <Card Margin="Margin.Is4.OnY">
            <CardHeader>
                <CardTitle>Manual Validation</CardTitle>
                <CardSubtitle>Example on how to validate manualy on submit.</CardSubtitle>
            </CardHeader>
            <CardBody>
                <Validations @ref="validations" @ref:suppressField Mode="ValidationMode.Manual">
                    <Field IsHorizontal="true">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Full Name</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidationRule.IsNotEmpty">
                                <TextEdit Placeholder="First and last name">
                                    <Feedback>
                                        <ValidationError>Enter full name!</ValidationError>
                                    </Feedback>
                                </TextEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Email address</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidationRule.IsEmail">
                                <TextEdit Placeholder="Enter email">
                                    <Feedback>
                                        <ValidationSuccess>Email is good</ValidationSuccess>
                                        <ValidationError>Enter valid email!</ValidationError>
                                    </Feedback>
                                </TextEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Password</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidatePassword">
                                <TextEdit Role="TextRole.Password" Placeholder="Password" @bind-Text="@password">
                                    <Feedback>
                                        <ValidationError>Password must be at least 6 characters long!</ValidationError>
                                    </Feedback>
                                </TextEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Re Password</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidatePassword2">
                                <TextEdit Role="TextRole.Password" Placeholder="Retype password">
                                    <Feedback>
                                        <ValidationError>Password does not match!</ValidationError>
                                    </Feedback>
                                </TextEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Input Select</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidateSelect">
                                <SelectEdit TValue="int?">
                                    <ChildContent>
                                        <SelectItem Value="@((int?)null)"></SelectItem>
                                        <SelectItem Value="@((int?)1)">1</SelectItem>
                                        <SelectItem Value="@((int?)2)">2</SelectItem>
                                        <SelectItem Value="@((int?)3)">3</SelectItem>
                                        <SelectItem Value="@((int?)4)">4</SelectItem>
                                    </ChildContent>
                                    <Feedback>
                                        <ValidationError>Select one value!</ValidationError>
                                    </Feedback>
                                </SelectEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Date</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidateDateOfBirth">
                                <DateEdit>
                                    <Feedback>
                                        <ValidationError>You must enter date of birth!</ValidationError>
                                    </Feedback>
                                </DateEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                        <FieldLabel ColumnSize="ColumnSize.Is2">Pattern</FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation UsePattern="true">
                                <TextEdit Pattern="[A-Za-z]{3}">
                                    <Feedback>
                                        <ValidationError>Pattern [A-Za-z]{3} does not match!</ValidationError>
                                    </Feedback>
                                </TextEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                        <FieldLabel ColumnSize="ColumnSize.Is2"></FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <Validation Validator="@ValidateCheck">
                                <CheckEdit>
                                    <ChildContent>
                                        Check me out
                                    </ChildContent>
                                    <Feedback>
                                        <ValidationError>You must check me out!</ValidationError>
                                    </Feedback>
                                </CheckEdit>
                            </Validation>
                        </FieldBody>
                    </Field>
                    <Field IsHorizontal="true" JustifyContent="JustifyContent.End">
                        <FieldLabel ColumnSize="ColumnSize.Is2"></FieldLabel>
                        <FieldBody ColumnSize="ColumnSize.Is10">
                            <SimpleButton Color="Color.Primary" Clicked="@Submit">Submit</SimpleButton>
                        </FieldBody>
                    </Field>
                </Validations>
            </CardBody>
        </Card>
    </Column>
</Row>
@code{
    Validations validations;

    string password;

    void ValidatePassword( ValidatorEventArgs e )
    {
        e.Status = Convert.ToString( e.Value )?.Length >= 6 ? ValidationStatus.Success : ValidationStatus.Error;
    }

    void ValidatePassword2( ValidatorEventArgs e )
    {
        var password2 = Convert.ToString( e.Value );

        if ( password2?.Length < 6 )
        {
            e.Status = ValidationStatus.Error;
            e.ErrorText = "Password must be at least 6 characters long!";
        }
        else if ( password2 != password )
        {
            e.Status = ValidationStatus.Error;
        }
        else
        {
            e.Status = ValidationStatus.Success;
        }
    }

    void ValidateCheck( ValidatorEventArgs e )
    {
        e.Status = Convert.ToBoolean( e.Value ) ? ValidationStatus.Success : ValidationStatus.Error;
    }

    void ValidateSelect( ValidatorEventArgs e )
    {
        var selectedValue = e.Value == null ? 0 : Convert.ToInt32( e.Value );
        e.Status = selectedValue != 0 ? ValidationStatus.Success : ValidationStatus.Error;
    }

    void ValidateDateOfBirth( ValidatorEventArgs e )
    {
        var date = e.Value as DateTime?;

        if ( date == null )
        {
            e.Status = ValidationStatus.Error;
        }
        else if ( date?.Year < 1900 )
        {
            e.Status = ValidationStatus.Error;
            e.ErrorText = "Date cannot be less then 01.01.1900!";
        }
        else
        {
            e.Status = ValidationStatus.Success;
        }
    }

    void Submit()
    {
        if ( validations.ValidateAll() )
        {
            validations.ClearAll();
        }
    }
}